<template>
  <basic-dialog v-model="visible" title="调整状态" hideFooter width="500">
    <avue-form v-model="formData" ref="formRef" :option="option" @submit="handleSubmit"></avue-form>
  </basic-dialog>
</template>

<script setup>
import { apiChangeStatus } from '@/apis/device/deviceAccount.js'
const props = defineProps({
  refresh: Function
})
const visible = ref(false)
const formRef = ref()
const formData = ref({})
const option = ref({
  column: [
    {
      prop: 'status',
      label: '新状态',
      type: 'select',
      dicData: [{
        value: 'idle',
        label: '闲置'
      }, {
        value: 'degradeUse',
        label: '降级使用'
      }, {
        value: 'normal',
        label: '完好'
      }],
      span: 24,
      rules: [{
        required: true,
        message: '请必须选择状态',
        trigger: 'blur'
      }]
    }, {
      prop: 'operateDate',
      label: '执行日期',
      type: 'date',
      tip: "选择闲置时，就代表修改为闲置的日期，修改为降级使用时，就代表降级的日期",
      format: 'YYYY-MM-DD',
      span: 24,
    }
  ]
})
const selectedList = ref([])
const open = (list) => {
  visible.value = true
  selectedList.value = list
}
const close = () => {
  formRef.value.resetFields()
  visible.value = false
}
const handleSubmit = async (form) => {
  await apiChangeStatus(selectedList.value.map(item => {
    item.status = form.status
    item.operateDate = form.operateDate
    return item
  }))
  ElMessage.success('修改成功')
  close()
  props.refresh && props.refresh()
}

defineExpose({ open, close })
</script>

<style lang='scss' scoped></style>